<template>
    <div class="warp">
    	<h2>异常警告（次）</h2>
    	<line-chart1 :chart-data="activeDate.newVisitis" />
    	<h2>离床统计（人）</h2>
    	<line-chart :chart-data="activeDate.messages" />
    </div>
</template>

<script>
	import { searchCheckinInfoOfCondition, searchDailyCareListByListTime } from "@/api/record"
	import PanelGroup from './components/PanelGroup'
	import LineChart1 from './components/LineChart1'
	import LineChart from './components/LineChart'
	import RaddarChart from './components/RaddarChart'
	import PieChart from './components/PieChart'
	import BarChart from './components/BarChart'
	import TransactionTable from './components/TransactionTable'
	import TodoList from './components/TodoList'
	import BoxCard from './components/BoxCard'
    export default {
        name: "Medicalcheckup",
        components: {
        	PanelGroup,
        	LineChart,
        	LineChart1,
        	RaddarChart,
        	PieChart,
        	BarChart,
        	TransactionTable,
        	TodoList,
        	BoxCard
        },
        computed:{
            startAndFinish:{
                get(){
                    return [this.queryForm.checkedInTimeStart, this.queryForm.checkedInTimeEnd]
                },
                set(val){
                    this.queryForm.checkedInTimeStart = val ? val[0] : ''
                    this.queryForm.checkedInTimeEnd = val ? val[1] : ''
                },
            },
        },
        data(){
            return {
            	queryForm: {
            		elderlyCode: '',
            		checkedInTimeStart: '',
            		checkedInTimeEnd: '',
            	},
            	total: 0,
            	list: '',
            	showIndex: '',
            	activeRow: '',
            	listLoading: false,
            	activeDate: {
					newVisitis: {
						expectedData: [3, 5, 1, 2, 6, 0, 2, 3, 5, 1, 2, 6, 0, 2],
					},
					messages: {
						actualData: [5, 12, 10, 64, 52, 21, 10]
					},
					purchases: {
						expectedData: [110, 120, 116, 134, 125, 130, 118],
						actualData: [85, 90, 91, 84, 86, 88, 83]
					},
					shoppings: {
						expectedData: [130, 140, 141, 142, 145, 150, 160],
						actualData: [120, 82, 91, 154, 162, 140, 130]
					}
				},
            	dataLoading: false,
            }
        },
        mounted(){
            this.search(0)
        },
        methods: {
        	search(id) {
        		this.listLoading = true;
        		if (id == 0) {
        			this.queryForm.currPageNo = 1
        		}
        		searchCheckinInfoOfCondition(this.queryForm).then(res => {
        			this.list = res.data.data
        			this.total = res.data.total
        			this.listLoading = false;
        		})
        	},
        	getList(row) {
        		this.dataLoading = true
        		setTimeout(() => {
        			this.dataLoading = false
        			this.activeDate = {
						newVisitis: {
							expectedData: [50, 70, 80, 65, 58, 72, 61],
						},
						messages: {
							actualData: [45, 48, 51, 64, 52, 49, 60]
						},
						purchases: {
							expectedData: [110, 120, 116, 134, 125, 130, 118],
							actualData: [85, 90, 91, 84, 86, 88, 83]
						},
						shoppings: {
							expectedData: [130, 140, 141, 142, 145, 150, 160],
							actualData: [120, 82, 91, 154, 162, 140, 130]
						}
					}
        		}, 500)
        	},
        	handleSizeChange(val) {
        		this.queryForm.limit = val;
        		this.search();
        	},
        	handleCurrentChange(val) {
        		this.showIndex = ''
        		this.queryForm.currPageNo = val;
        		this.search();
        	}
        }
    }
</script>

<style scoped>
	.warp{padding: 20px;}
	.warp h2{line-height: 16px;padding-left: 10px;font-size: 16px;}
	
</style>
